<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .box{
            width: 200px;height: 200px;background: pink;position: absolute;left: 0;top: 0;
        }
    </style>
</head>
<body>
    <div class="box"></div>
</body>
<script>

    var obox=null;
    var offsetX=0;
    var offsetY=0;
    function Move(){

        obox=document.querySelector(".box");
        obox.onmousedown=funcDown;
        document.onmouseup=funcUp; 
    }



        function funcDown(eve){
        var e=eve||window.event;
        offsetX=e.clientX-obox.offsetLeft;
        offsetY=e.clientY-obox.offsetTop;
        document.onmousemove=funcMove;
        }
        function funcMove(eve){
            var e=eve||window.event;
            obox.style.left=e.clientX-offsetX+"px";
            obox.style.top=e.clientY-offsetY+"px";
        }
        function funcUp(){
            document.onmousemove="null"
        }
</script>
</html>